<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
   <script src="./jquery.min.js"></script>
</head>
<body>

<!--
  获取内容和属性
获得内容 - text()、html() 以及 val()
  三个简单实用的用于 DOM 操作的 jQuery 方法：
  text() - 设置或返回所选元素的文本内容
  html() - 设置或返回所选元素的内容（包括 HTML 标签）
  val() - 设置或返回表单字段的值
-->
<p><span>hello jquery1</span></p>
<p><span>hello jquery2</span></p>

<input type="text" value="hello">
<script>

  $(function (){

    let $p = $('p:first');
    let text = $p.text();
    console.log(text)
    let html = $p.html();
    console.log(html)

    // 设置新的数据
    $p.text('hello world')
    $p.html('<h1>hello world</h1>')

    // 获取表单控件
    let val = $('input').val();
    console.log(val)
  })

</script>
</body>
</html>